import React, { useState, useEffect, } from 'react'
import Flushed from '../../Monitoring_analytics/Operate_monitor/Component/Flushed';
import Reconciliation_table_pay from './Component/Reconiliation_table_pay';
import Reconciliation_table_Aftersales from './Component/Reconiliaction_table_Aftersales';
import Title from './Component/Reconciliation_title'
import { Tabs } from 'antd';
import type { TabsProps } from 'antd';


import { getbill } from '../../../request/api'





export default function After_sales_management() {
    useEffect(() => {
        allgetafter()
    }, [])









    let [type, settype] = useState('待审核')

    // 获取全部的用户信息
    let [afterdata, setdata] = useState([])
    const allgetafter: any = async () => {
        const data: any = await getbill({})
        console.log(data);
        setdata(data.data)
    }

    // 获取子组件传递的搜索完后的数据信息，更新用户信息
    const getTitle = (item: any) => {
        console.log(item);
        setdata(item)
    }

    // 接收title组件更改完数据之后，重新获取全部数据
    const getall = (item) => {
        console.log(item);
        if (item == 200) {
            allgetafter()
        }
    }


    const onChange = (key: string) => {
        console.log(key);
    };

    const items: TabsProps['items'] = [
        {
            key: '1',
            label: '支付订单',
            children: <Reconciliation_table_pay afterdata={afterdata}  getall={getall}  ></Reconciliation_table_pay>,
        },
        {
            key: '2',
            label: '售后订单',
            children: <Reconciliation_table_Aftersales afterdata={afterdata} getall={getall} ></Reconciliation_table_Aftersales>,
        },
    ];




    return (
        <div>
            <Title name='订单管理' getTitle={getTitle}  getall={getall} ></Title>
            <Flushed></Flushed>
            <div style={{ width: '100%', backgroundColor: 'white', padding: '0.5rem', marginTop: '0.5rem' }}>
                <Tabs defaultActiveKey="1" items={items} onChange={onChange} />
            </div>
        </div>
    )
}
